<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page import="java.util.List"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Set"%>
<%@page import="com.taobao.askwho.vo.PersonalPageRecordVo"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="快速找到解决问题的人或资料的网站">
<meta name="author" content="zhongting.zy">
<title>我的主页</title>
<!-- Le styles -->
<link href="<%= request.getContextPath()%>/assets/css/bootstrap.css"
	rel="stylesheet">
<style type="text/css">
body {
	padding-top: 60px;
	padding-bottom: 40px;
}
</style>
<link
	href="<%=request.getContextPath()%>/assets/css/bootstrap-responsive.css"
	rel="stylesheet">

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

<!-- Le fav and touch icons -->
<link rel="shortcut icon"
	href="<%= request.getContextPath()%>/assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144"
	href="<%=request.getContextPath()%>/assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114"
	href="<%=request.getContextPath()%>/assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72"
	href="<%=request.getContextPath()%>/assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed"
	href="<%=request.getContextPath()%>/assets/ico/apple-touch-icon-57-precomposed.png">
</head>
<%
	List<PersonalPageRecordVo> itemList = (List<PersonalPageRecordVo>)request.getAttribute("itemList");
	if(itemList == null)
		itemList = new ArrayList<PersonalPageRecordVo>();
%>
<body>
	<%@include file="/jsp/header.jsp" %>
	<div class="container">
		<div class="row">
			<div class="span12">
                <form class="well form-search">
                    <!--
                     <div align="center">
                          <input type="text" class="input-xxlarge search-query"
                           placeholder="要查询的标签，空格分开" name="pkeyword" id ="pkeyword">
                           <button type="submit" class="btn">查询</button>
                     </div>
                     -->
                    <div style="float: right;">
                        <a class="btn btn-small btn-primary" data-toggle="modal" href="#myModal">添加新内容</a>
                        <a class="btn btn-small btn-success" target=“_blank”
                           href="<%=request.getContextPath()%>/urljump.do?method=shareAllPublicTags&otherUuid=${userUuid}">分享给别人</a>
                    </div>
                </form>
				<table class="table table-striped" id="personalPageTable">
					<thead>
						<tr>
							<th width="50%">内容（按内容做汇总）</th>
							<th width="5%">类型</th>
							<th width="5%">权限</th>
							<th width="30%">标签</th>
							<th width="10%">
							<div align="center">操作</div>
							</th>
						</tr>
					</thead>
					<tbody>
					<%
						for(PersonalPageRecordVo vo : itemList) {
							String content = "";
							String type = vo.getType(); 
							if(type.equals("url")) {
								content = "<a href='" + vo.getUrlInfo().getUrlContent() + "' target='_blank;'>" + vo.getUrlInfo().getUrlContent() + "</a>";
							} else {
								content = vo.getPersonInfo().getPersonName() 
										+ "(旺旺:" + vo.getPersonInfo().getWangwang() + ")";
							}
							Set<String> set = vo.getTagNamesSet();
							String tagLinkContent = "";
							for(String tagName : set) {
								tagLinkContent +="<a href='#'>" + tagName + "</a>&nbsp;&nbsp;";
							}
							String isPublic = "";
							if(vo.isPublic())
								isPublic = "公开";
							else
								isPublic = "私有";
							String tagIds = vo.getTagUuidsString();
					%>
						<tr>
							<td><%=content%></td>
							<td><%=vo.getType()%></td>
							<td><%=isPublic%></td>
							<td><%=tagLinkContent%></td>
							<td>
								<div align="center">
									<button class="btn btn-small btn-warning" type="submit" style="display: none;">修改</button>
									<button class="btn btn-small btn-danger" onclick="deleteByUuids('<%=tagIds%>','<%=type%>')">删除</button>								
								</div>
							</td>
						</tr>						
					<%
						}
					%>
					</tbody>
				</table>
				<!-- 
				<p>
					<a class="btn" href="#">查看更多 &raquo;</a>
				</p>
				 -->
			</div>
			<!-- 弹出窗口默认560px，现改为640px -->
			<div class="modal hide fade" id="myModal" style="width: 600px;">
			  <div class="modal-header">
			    <button type="button" class="close" data-dismiss="modal">×</button>
			    <h3>添加要关注的内容</h3>
			  </div>
			  <div class="modal-body">
				<ul class="nav nav-tabs" id="myTab">
				  <li class="active"><a href="#url">添加网址</a></li>
				  <li><a href="#person">添加人</a></li>
				</ul>
				<div class="tab-content">
				  <div class="tab-pane active" id="url">
				  <form class="well" id="urlform">
					  <label style="display: none;">要保存的标签,暂存格式以后用</label>
					  <input type="text" class="span4" placeholder="要保存的网址" id="urlContent" name="urlContent">
					  <input type="text" class="span4" placeholder="标签名称，逗号分割" id="tagStringUrl" name="tagStringUrl">
					  <select class="span4" id="isPublicUrl" name = "isPublicUrl" title="人人为我，我为人人噢">
					  	<option value="true">分享所有人</option>
					  	<option value="false">自己收藏</option>
					  </select>
				 </form>
				  </div>
				  <div class="tab-pane" id="person">
				  <form class="well" id="personform">
					  <label style="display: none;">要保存的标签,暂存格式以后用</label>
					  <input type="text" class="span4" placeholder="人名(或花名)" id="personName" name="personName">
					  <input type="text" class="span4" placeholder="旺旺"  id="wangwang" name="wangwang">
					  <input type="text" class="span4" placeholder="标签名称，逗号分割"  id="tagStringPerson" name="tagStringPerson">
					  <select class="span4" id="isPublicPerson" name = "isPublicPerson" title="人人为我，我为人人噢">
					  	<option value="true">分享所有人</option>
					  	<option value="false">自己收藏</option>
					  </select>					  
				 </form>
				 <input type="hidden" id="curentType" name="curentType" value="url" />
				 <input type="hidden" id="userUuid" name="userUuid" value="${userUuid}" />			  
				  </div>
				</div>
			  </div>
			  <div class="modal-footer">
			  <div style="float: left;">标签最好是一个名词，具有概括性，便于搜索，不超过7个字</div>
			  <div style="float: right;">
			  	<button id="btnSaveNew" name="btnSaveNew" class="btn btn-primary">保存</button>
			  	<a href="#" class="btn" data-dismiss="modal">关闭</a>
			  </div>
			  </div>
			 </div>
		</div>
		<!--/row-->
		<hr>
	<%@include file="/jsp/footer.jsp" %>
	</div>
	<!--/.fluid-container-->

	<!-- Le javascript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="<%=request.getContextPath()%>/assets/js/jquery.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-transition.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-alert.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-modal.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-dropdown.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-scrollspy.js"></script>
	<script src="<%=request.getContextPath()%>/assets/js/bootstrap-tab.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-tooltip.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-popover.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-button.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-collapse.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-carousel.js"></script>
	<script
		src="<%=request.getContextPath()%>/assets/js/bootstrap-typeahead.js"></script>

    <!--datatable -->
    <link href="<%=request.getContextPath()%>/assets/js/dataTables/css/jquery.dataTables.css" rel="stylesheet">
    <link href="<%=request.getContextPath()%>/assets/js/dataTables/css/jquery.dataTables_themeroller.css" rel="stylesheet">
    <script src="<%=request.getContextPath()%>/assets/js/dataTables/js/jquery.dataTables.min.js"></script>
    <!--  highlight -->

	<script>
		$(function() {
			//$('#myTab a[href="#url"]').tab('show');
			
			$('#myTab a').click(function (e) {
				  e.preventDefault();
				  var nodeValue = $(this)[0].attributes[0].nodeValue;
				  if(nodeValue == "#url") {
					  $('#curentType').attr("value", "url");
				  } else {
					  $('#curentType').attr("value", "person");
				  }
				  $(this).tab('show');
			})
			
			//show,shown,hide,hidden  四个状态
			$('#myModal').on('show', function () {
				//理想情况进来时都是显示添加URL界面，目前暂未实现
			})
			$('#myModal').on('hidden', function () {
				$('#urlform')[0].reset();
				$('#personform')[0].reset();
			})
			//点击添加窗口的添加表单
			$("#btnSaveNew").click(function() {
				
				var type = $("#urlContent").val();
				var curentType = $("#curentType").val();
				if(curentType == "url") {
					$.ajax({
						  url: '<%=request.getContextPath()%>/urlopt.do?method=addNewUrl',
						  dataType: 'json',
						  type: "post",
						  data: {
							  urlContent: $("#urlContent").val(),
							  isPublic: $("#isPublicUrl").val(),
							  tagString: $("#tagStringUrl").val(),
							  userUuid: $("#userUuid").val()
						  },
						  success: function(data) {
							if(data.success) {
								//alert("保存成功");
								$('#myModal').modal('hide');
								window.location.reload();
							} else {
								//alert(data.msg);
								alert("保存失败");
							}
						  }
						});					
				} else {	//person
					$.ajax({
						  url: '<%=request.getContextPath()%>/personopt.do?method=addNewPerson',
						  dataType: 'json',
						  type: "post",
						  data: {
							  personName: $("#personName").val(),
							  wangwang: $("#wangwang").val(),
							  tagString: $("#tagStringPerson").val(),
							  isPublic: $("#isPublicPerson").val(),
							  userUuid: $("#userUuid").val()
						  },
						  success: function(data) {
							if(data.success) {
								//alert("保存成功");
								$('#myModal').modal('hide');
								window.location.reload();
							} else {
								//alert(data.msg);
								alert("保存失败");
							}
						  }
						});					
				}
				return true;
			});

            //datatable数据
            $('#personalPageTable').dataTable({
                "bJQueryUI" : true,
                iDisplayLength:100,
                "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span10'i><'span1'p>>",
                "oLanguage" : {
                    "sLengthMenu" : "每页显示 _MENU_ ",
                    "sZeroRecords" : "对不起,没有数据...",
                    //"sInfo" : "从 _START_ 到 _END_ 共 _TOTAL_ 数据",
                    "sInfo" : "",
                    //"sInfoEmpty" : "显示从 0 到 0 的 0 数据",
                    "sInfoEmpty" : "",
                    "sSearch": "<strong>按标签名模糊搜索</storng>",
                    //"sInfoFiltered" : "(共 _MAX_ 条数据)"
                    "sInfoFiltered" : ""
                }
            });
            //调整搜索框的位置
		})
		function deleteByUuids(ids,type) {
			$.ajax({
				  url: '<%=request.getContextPath()%>/tagopt.do?method=deleteByTagUuids',
				  dataType: 'json',
				  type: "post",
				  data: {
					  tagUuids: ids,
					  type: type
				  },
				  success: function(data) {
					if(data.success) {
						//alert("删除成功");
						window.location.reload();
					} else {
						alert(data.msg);
						//alert("保存失败");
					}
				  }
				});				
		}
	</script>
</body>
</html>
